import * as THREE from "three"
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls"
import { Vector3 } from "three"
import * as TWEEN from "@tweenjs/tween.js"

interface cameraOptions {
    type?: string
    args?: Array<number>
}
class MyThree {
    scene: THREE.Scene
    camera: THREE.Camera
    renderer: THREE.WebGLRenderer
    controls?: OrbitControls
    light: THREE.Light
    TWEEN
    constructor(canvasElement, cameraOptions?: cameraOptions) {
        this.initScene()
        this.initCamera(cameraOptions)
        this.initLight()
        this.initRenderer(canvasElement)
        this.addResize()
        this.initOrbitControls()
        this.animation()
        this.TWEEN = TWEEN
    }
    initScene() {
        this.scene = new THREE.Scene()
    }
    initCamera(cameraOptions?: cameraOptions) {
        let defaultOptions = {
            type: "PerspectiveCamera",
            args: [45, 1920 / 937, 1, 100000]
        }
        let options = Object.assign(defaultOptions, cameraOptions)
        this.camera = new THREE[options.type](...options.args)
        this.camera.position.set(500, 500, 500)
        this.camera.lookAt(new Vector3(0, 0, 0))
    }
    initRenderer(canvasElement) {
        this.renderer = new THREE.WebGLRenderer({ canvas: canvasElement })
        this.renderer.setSize(window.innerWidth, window.innerHeight)
        this.renderer.setClearColor(0x000)
    }
    initLight() {
        this.light = new THREE.SpotLight(0xffffff);
        this.light.position.set(300, 500, 300);
        this.scene.remove(this.light)
        this.scene.add(this.light)
    }
    initOrbitControls() {
        let controls = this.controls
        controls = new OrbitControls(this.camera, this.renderer.domElement)
        controls.enableDamping = true
        controls.maxDistance = 2500
        controls.minDistance = 10
    }
    animation() {
        // this.controls && this.controls?.update()
        // console.log(this.TWEEN);

        // this.TWEEN && this.TWEEN?.update()
        this.renderer.render(this.scene, this.camera)
        // this.camera.lookAt(new Vector3(0,0,0))
    }
    addMesh(data) {
        this.scene.add(data)
    }
    addResize() {
        window.addEventListener('resize', () => {
            // canvas.width = window.innerWidth
            // canvas.height = window.innerHeight
            let { x, y, z } = this.camera.position

            this.initCamera({
                args: [45, window.innerWidth / window.innerHeight, 1, 100000]
            })
            this.camera.position.set(x, y, z)
            this.initOrbitControls()
            this.renderer.setSize(window.innerWidth, window.innerHeight)

        })
    }
}
export { MyThree }